    $("header").load("1.head.html")
    $("footer").load("2.bottom.html")   

function Carousel(){
    this.carousel = document.querySelector('.carousel');
    this.ulis = this.carousel.querySelectorAll('ul li')
    this.olis = this.carousel.querySelectorAll('ol li')
    this.leftBtn = this.carousel.querySelector('span.leftBtn')
    this.rightBtn = this.carousel.querySelector('span.rightBtn')
    this.index = 0
    this.timerId = null
}
Carousel.prototype.move = function(){
    // console.log(this);
    this.rightBtn.onclick = () => {
    
        this.index++
   
        if(this.index === this.ulis.length){
            this.index = 0
        }
    
        for(var i=0;i<this.ulis.length;i++){
            this.ulis[i].className = this.olis[i].className = ''
        }
        this.ulis[this.index].className = this.olis[this.index].className = 'active'
    }
 
    this.leftBtn.onclick = () => {
    
        // console.log(this); // 这是事件源 - 不能操作.index - 需要换成剪头函数
        this.index--
 
        if(this.index < 0){
            this.index = this.ulis.length-1
        }
   
        for(var i=0;i<this.ulis.length;i++){
            this.ulis[i].className = this.olis[i].className = ''
        }
        this.ulis[this.index].className = this.olis[this.index].className = 'active'
    }
 
    for(let j=0;j<this.olis.length;j++){
        this.olis[j].onclick = () => {
            // console.log(this);
            this.index = j
            for(var i=0;i<this.ulis.length;i++){
                this.ulis[i].className = this.olis[i].className = ''
            }
            this.ulis[this.index].className = this.olis[this.index].className = 'active'
        }
    }
 
 
    this.timerId = setInterval(() => {
        this.rightBtn.onclick()
    }, 2000)
 

    this.carousel.onmouseover = () => {
        clearInterval(this.timerId)
    }

    this.carousel.onmouseout = () => {
        this.timerId = setInterval(() => {
            this.rightBtn.onclick()
        }, 3000)
    }
}
function getCarousel() {
    let r;
    $.ajax({
        type: "get",
        url: "./goods/bannerGet.php",
        success: function (res) {
            let e = JSON.parse(res);
            console.log(e)
            for (var i =0; i<e.length; i++) {
                $("#carousel").find("a").eq(i).html(`<img src="${e[i].img}" alt="">`)
            }
            var c = new Carousel()
            console.log(c);
            c.move()
            // r = setInterval(function () {
            //     t++, 5 == t && (t = 0), $("#oImg").find("img").attr("src", e[t].img)
            // }, 2000)
        },
        error: function (n) {
            console.log(n)
        }
    })
}
getCarousel();
